<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>Document</title>
		<meta name="viewport" content="width=device-width,initial-scale=1">
		<link rel="stylesheet" href="css/bootstrap.css">
		<script src="js/jquery.min.js"></script>
		<script src="js/popper.min.js"></script>
		<script src="js/bootstrap.min.js"></script>
		<link rel="stylesheet" type="text/css" href="css/comm.css"/>
		<link rel="stylesheet" type="text/css" href="css/list.css"/>
	</head>
	<body>
		<header>
			<iframe class="iframe_header" scrolling="no" src="header.html" ></iframe>
		</header>
		<div class="container mt-2">
			<div>
				<img class="w-100" src="img/index/index_guild.png" >
			</div>
			<div class="row no-gutters">
				<!-- 左 -->
				<div class="col-sm-12 col-lg-9">
					<p class="bg_gray py-2 mb-0 pl-4 text-muted">笔记本电脑</p>
					<!-- 列表主题 -->
					<div class="row no-gutters bg-white">
						<div class="col-sm-12 col-md-6 col-lg-4 col-xl-3 p-2">
							<div class="d-flex flex-column border p-1">
								<div><img class="w-100" src="img/57ad359dNd4a6f130.jpg" ></div>
								<p class="font-weight-bold text-primary m-0">￥6988.00</p>
								<a class="text-muted small" href="#">Apple MacBook Air 13.3英寸笔记本 银色(Core i5 处理器/8GB内存/128GB SSD闪存 MMGF2CH/A)</a>
								<div class="d-flex justify-content-around align-content-center">
									<button class="list_btn1">-</button>
									<input class="w-10 border-0 text-center" type="text" value="1">
									<button class="list_btn1">+</button>
									<a class="brn btn-primary btn-sm" href="#">加入购物车</a>
								</div>
							</div>
						</div>
						<div class="col-sm-12 col-md-6 col-lg-4 col-xl-3 p-2">
							<div class="d-flex flex-column border p-1">
								<div><img class="w-100" src="img/57ad359dNd4a6f130.jpg" ></div>
								<p class="font-weight-bold text-primary m-0">￥6988.00</p>
								<a class="text-muted small" href="#">Apple MacBook Air 13.3英寸笔记本 银色(Core i5 处理器/8GB内存/128GB SSD闪存 MMGF2CH/A)</a>
								<div class="d-flex justify-content-around align-content-center">
									<button class="list_btn1">-</button>
									<input class="w-10 border-0 text-center" type="text" value="1">
									<button class="list_btn1">+</button>
									<a class="brn btn-primary btn-sm" href="#">加入购物车</a>
								</div>
							</div>
						</div>
						<div class="col-sm-12 col-md-6 col-lg-4 col-xl-3 p-2">
							<div class="d-flex flex-column border p-1">
								<div><img class="w-100" src="img/57ad359dNd4a6f130.jpg" ></div>
								<p class="font-weight-bold text-primary m-0">￥6988.00</p>
								<a class="text-muted small" href="#">Apple MacBook Air 13.3英寸笔记本 银色(Core i5 处理器/8GB内存/128GB SSD闪存 MMGF2CH/A)</a>
								<div class="d-flex justify-content-around align-content-center">
									<button class="list_btn1">-</button>
									<input class="w-10 border-0 text-center" type="text" value="1">
									<button class="list_btn1">+</button>
									<a class="brn btn-primary btn-sm" href="#">加入购物车</a>
								</div>
							</div>
						</div>
						<div class="col-sm-12 col-md-6 col-lg-4 col-xl-3 p-2">
							<div class="d-flex flex-column border p-1">
								<div><img class="w-100" src="img/57ad359dNd4a6f130.jpg" ></div>
								<p class="font-weight-bold text-primary m-0">￥6988.00</p>
								<a class="text-muted small" href="#">Apple MacBook Air 13.3英寸笔记本 银色(Core i5 处理器/8GB内存/128GB SSD闪存 MMGF2CH/A)</a>
								<div class="d-flex justify-content-around align-content-center">
									<button class="list_btn1">-</button>
									<input class="w-10 border-0 text-center" type="text" value="1">
									<button class="list_btn1">+</button>
									<a class="brn btn-primary btn-sm" href="#">加入购物车</a>
								</div>
							</div>
						</div>
						<div class="col-sm-12 col-md-6 col-lg-4 col-xl-3 p-2">
							<div class="d-flex flex-column border p-1">
								<div><img class="w-100" src="img/57ad359dNd4a6f130.jpg" ></div>
								<p class="font-weight-bold text-primary m-0">￥6988.00</p>
								<a class="text-muted small" href="#">Apple MacBook Air 13.3英寸笔记本 银色(Core i5 处理器/8GB内存/128GB SSD闪存 MMGF2CH/A)</a>
								<div class="d-flex justify-content-around align-content-center">
									<button class="list_btn1">-</button>
									<input class="w-10 border-0 text-center" type="text" value="1">
									<button class="list_btn1">+</button>
									<a class="brn btn-primary btn-sm" href="#">加入购物车</a>
								</div>
							</div>
						</div>
						<div class="col-sm-12 col-md-6 col-lg-4 col-xl-3 p-2">
							<div class="d-flex flex-column border p-1">
								<div><img class="w-100" src="img/57ad359dNd4a6f130.jpg" ></div>
								<p class="font-weight-bold text-primary m-0">￥6988.00</p>
								<a class="text-muted small" href="#">Apple MacBook Air 13.3英寸笔记本 银色(Core i5 处理器/8GB内存/128GB SSD闪存 MMGF2CH/A)</a>
								<div class="d-flex justify-content-around align-content-center">
									<button class="list_btn1">-</button>
									<input class="w-10 border-0 text-center" type="text" value="1">
									<button class="list_btn1">+</button>
									<a class="brn btn-primary btn-sm" href="#">加入购物车</a>
								</div>
							</div>
						</div>
						<div class="col-sm-12 col-md-6 col-lg-4 col-xl-3 p-2">
							<div class="d-flex flex-column border p-1">
								<div><img class="w-100" src="img/57ad359dNd4a6f130.jpg" ></div>
								<p class="font-weight-bold text-primary m-0">￥6988.00</p>
								<a class="text-muted small" href="#">Apple MacBook Air 13.3英寸笔记本 银色(Core i5 处理器/8GB内存/128GB SSD闪存 MMGF2CH/A)</a>
								<div class="d-flex justify-content-around align-content-center">
									<button class="list_btn1">-</button>
									<input class="w-10 border-0 text-center" type="text" value="1">
									<button class="list_btn1">+</button>
									<a class="brn btn-primary btn-sm" href="#">加入购物车</a>
								</div>
							</div>
						</div>
						<div class="col-sm-12 col-md-6 col-lg-4 col-xl-3 p-2">
							<div class="d-flex flex-column border p-1">
								<div><img class="w-100" src="img/57ad359dNd4a6f130.jpg" ></div>
								<p class="font-weight-bold text-primary m-0">￥6988.00</p>
								<a class="text-muted small" href="#">Apple MacBook Air 13.3英寸笔记本 银色(Core i5 处理器/8GB内存/128GB SSD闪存 MMGF2CH/A)</a>
								<div class="d-flex justify-content-around align-content-center">
									<button class="list_btn1">-</button>
									<input class="w-10 border-0 text-center" type="text" value="1">
									<button class="list_btn1">+</button>
									<a class="brn btn-primary btn-sm" href="#">加入购物车</a>
								</div>
							</div>
						</div>
						<div class="col-sm-12 col-md-6 col-lg-4 col-xl-3 p-2">
							<div class="d-flex flex-column border p-1">
								<div><img class="w-100" src="img/57ad359dNd4a6f130.jpg" ></div>
								<p class="font-weight-bold text-primary m-0">￥6988.00</p>
								<a class="text-muted small" href="#">Apple MacBook Air 13.3英寸笔记本 银色(Core i5 处理器/8GB内存/128GB SSD闪存 MMGF2CH/A)</a>
								<div class="d-flex justify-content-around align-content-center">
									<button class="list_btn1">-</button>
									<input class="w-10 border-0 text-center" type="text" value="1">
									<button class="list_btn1">+</button>
									<a class="brn btn-primary btn-sm" href="#">加入购物车</a>
								</div>
							</div>
						</div>
						<div class="col-sm-12 col-md-6 col-lg-4 col-xl-3 p-2">
							<div class="d-flex flex-column border p-1">
								<div><img class="w-100" src="img/57ad359dNd4a6f130.jpg" ></div>
								<p class="font-weight-bold text-primary m-0">￥6988.00</p>
								<a class="text-muted small" href="#">Apple MacBook Air 13.3英寸笔记本 银色(Core i5 处理器/8GB内存/128GB SSD闪存 MMGF2CH/A)</a>
								<div class="d-flex justify-content-around align-content-center">
									<button class="list_btn1">-</button>
									<input class="w-10 border-0 text-center" type="text" value="1">
									<button class="list_btn1">+</button>
									<a class="brn btn-primary btn-sm" href="#">加入购物车</a>
								</div>
							</div>
						</div>
						<div class="col-sm-12 col-md-6 col-lg-4 col-xl-3 p-2">
							<div class="d-flex flex-column border p-1">
								<div><img class="w-100" src="img/57ad359dNd4a6f130.jpg" ></div>
								<p class="font-weight-bold text-primary m-0">￥6988.00</p>
								<a class="text-muted small" href="#">Apple MacBook Air 13.3英寸笔记本 银色(Core i5 处理器/8GB内存/128GB SSD闪存 MMGF2CH/A)</a>
								<div class="d-flex justify-content-around align-content-center">
									<button class="list_btn1">-</button>
									<input class="w-10 border-0 text-center" type="text" value="1">
									<button class="list_btn1">+</button>
									<a class="brn btn-primary btn-sm" href="#">加入购物车</a>
								</div>
							</div>
						</div>
						<div class="col-sm-12 col-md-6 col-lg-4 col-xl-3 p-2">
							<div class="d-flex flex-column border p-1">
								<div><img class="w-100" src="img/57ad359dNd4a6f130.jpg" ></div>
								<p class="font-weight-bold text-primary m-0">￥6988.00</p>
								<a class="text-muted small" href="#">Apple MacBook Air 13.3英寸笔记本 银色(Core i5 处理器/8GB内存/128GB SSD闪存 MMGF2CH/A)</a>
								<div class="d-flex justify-content-around align-content-center">
									<button class="list_btn1">-</button>
									<input class="w-10 border-0 text-center" type="text" value="1">
									<button class="list_btn1">+</button>
									<a class="brn btn-primary btn-sm" href="#">加入购物车</a>
								</div>
							</div>
					</div>
				<!-- 分页条 -->
				<div class="bg_gray py-2 w-100 d-flex justify-content-end">
					<ul class="pagination mb-0 mr-3">
						<li class="page-item mx-1 disabled"><a class="page-link rounded bg-transparent" href="#">上一页</a></li>
						<li class="page-item mx-1 active"><a class="page-link rounded  bg-transparent" href="#">1</a></li>
						<li class="page-item mx-1"><a class="page-link rounded bg-transparent" href="#">2</a></li>
						<li class="page-item mx-1"><a class="page-link rounded bg-transparent" href="#">3</a></li>
						<li class="page-item mx-1"><a class="page-link rounded bg-transparent" href="#">4</a></li>
						<li class="page-item mx-1"><a class="page-link rounded bg-transparent" href="#">5</a></li>
						<li class="page-item mx-1"><a class="page-link rounded bg-transparent" href="#">下一页</a></li>
					</ul>
				</div>
			</div>
		</div>
				<!-- 右 -->
				<div class="col-sm-12 col-lg-3 pl-3">
					<p class="bg_gray py-2 pl-3 mb-0">
						<img src="img/foodstore_icon2.png" >
						商家公告
					</p>
					<div class="bg-white p-4 text-muted small">
						<p>本店推出全网最低价套餐，保证比其他平台的价格要低！</p>
						<p>不要葱、姜、蒜等这些忌口暂时无法坐不了，敬请谅解！</p>
						<p>晚上10点以后订餐需另加送餐费2元！谢谢合作！</p>
						
					</div>
					<ul class="list-group mt-4">
						<li class="bg-gray d-flex justify-content-between px-2 py-1">
							<span class="text-muted">购物车</span>
							<a class="text-muted" href="#">清空</a>
						</li>
						<li class="bg-white d-flex justify-content-around align-items-center p-1 border-top">
							<span class="text-truncate w-40">Apple MacBook Air 13.3英寸笔记本 银色(Core i5 处理器/8GB内存/128GB SSD闪存 MMGF2CH/A)</span>
							<button class="list_btn2">-</button>
							<input class="w-10 border-0 text-center" type="text" value="1">
							<button class="list_btn2">+</button>
							<span>￥6988.00</span>
						</li>
						<li class="bg-white d-flex justify-content-around align-items-center p-1 border-top">
							<span class="text-truncate w-40">Apple MacBook Air 13.3英寸笔记本 银色(Core i5 处理器/8GB内存/128GB SSD闪存 MMGF2CH/A)</span>
							<button class="list_btn2">-</button>
							<input class="w-10 border-0 text-center" type="text" value="1">
							<button class="list_btn2">+</button>
							<span>￥6988.00</span>
						</li>
						<li class="bg-white d-flex justify-content-around align-items-center p-1 border-top">
							<span class="text-truncate w-40">Apple MacBook Air 13.3英寸笔记本 银色(Core i5 处理器/8GB内存/128GB SSD闪存 MMGF2CH/A)</span>
							<button class="list_btn2">-</button>
							<input class="w-10 border-0 text-center" type="text" value="1">
							<button class="list_btn2">+</button>
							<span>￥6988.00</span>
						</li>
						<li class="bg-white d-flex justify-content-around align-items-center p-1 border-top">
							<span class="text-truncate w-40">Apple MacBook Air 13.3英寸笔记本 银色(Core i5 处理器/8GB内存/128GB SSD闪存 MMGF2CH/A)</span>
							<button class="list_btn2">-</button>
							<input class="w-10 border-0 text-center" type="text" value="1">
							<button class="list_btn2">+</button>
							<span>￥6988.00</span>
						</li>
						<li class="bg-white d-flex justify-content-around align-items-center p-1 border-top">
							<span class="text-truncate w-40">Apple MacBook Air 13.3英寸笔记本 银色(Core i5 处理器/8GB内存/128GB SSD闪存 MMGF2CH/A)</span>
							<button class="list_btn2">-</button>
							<input class="w-10 border-0 text-center" type="text" value="1">
							<button class="list_btn2">+</button>
							<span>￥6988.00</span>
						</li>
						<li class="row no-gutters">
							<div class="col-9 bg-secondary py-1 px-2 d-flex justify-content-center align-items-center">
								<img src="img/foodstore_car_2.png" >
								<span class="text-white h4 pt-2">￥3433.00</span>
								
							</div>
							<a class="col-3 d-block bg-primary text-white text-center pt-2" href="#">去结算</a>
						</li>	
					</ul>
					</div>
				</div>
		</div>
		<footer>
			<iframe class="iframe_footer" scrolling="no" src="footer.html">
		</footer>
	</body>
</html>